import { App } from 'vue';
import { getPageY } from '../utils/dom';

function direcInstall(app: App): void {
    app.directive('pull-fade', {
        mounted(el: any) {
            let pgHeight = getPageY();
            function add(): void {
                let eleTop = el.getBoundingClientRect().top;
                if (eleTop <  pgHeight  &&  eleTop > 0) {
                    el.classList.add("fade-in-bottom");
                    setTimeout(() => {
                        window.removeEventListener('scroll', el._addAni_, false);
                        // el.classList.remove("fade-in-bottom");
                    },1000)
                }
            }
            el._addAni_ = add
            add()
            window.addEventListener('scroll',el._addAni_,false)
        },
        beforeUnmount(el: any) {
            window.removeEventListener('scroll', el._addAni_, false);
            el._addAni_ = null;
        }
    })
}


export default direcInstall;

